import React from "react";
import Input from "../../components/Input";
import type { FieldBaseType } from "../../type";

export default function PasswordField({
  field,
  isValid,
  onChange,
}: {
  field: FieldBaseType<string>;
  isValid: boolean;
  onChange: (value: string) => void;
}) {
  const {
    value: propsValue,
    defaultValue,
    placeholder,
    suffix,
    disabled,
  } = field;

  const value = propsValue ?? defaultValue ?? "";

  return (
    <Input
      placeholder={placeholder}
      invalid={!isValid}
      value={value}
      type="password"
      suffix={suffix}
      disabled={disabled}
      onChange={onChange}
    />
  );
}
